@import "../../../asset/style/index";
.shop-map {
    width: 100vw;
    height: 100vh;
}
//商品分类
.shop-sort{
    position: fixed;
    bottom: 0;
    width: 100%;
    .shop-sort-ck{
        width: 150px;
        margin:0 auto;
        display: flex;
        align-items: center;
        justify-content: space-between;
        font-size: $font-size-base;
        padding: 16px;
        .sort-target{
            transition: all 0.3s ease;
            transform:rotate(90deg);
            font-variant: all-small-caps;
        }
    }
    .restore-site{
        float: left;
        margin-left: 32px;
        .restore-site-wrap{
            width: 80px;
            height: 80px;
            text-align: center;
            display: flex;
            background: $white;
            align-items: center;
            justify-content: center;
            margin-bottom: 24px;
            border-radius: 50px;
            font-size: 20px;
            box-shadow:0 0 30px 10px rgba(0,0,0,.1);
            .site-img{
                width: 44px;
                height: 44px;
            }
        }
    }
    .shop-sort-wrap{
        background: $white;
        margin:0 auto;
        box-shadow:0 -7px 30px 10px rgba(0,0,0,.1);
        border-top-right-radius: 40px;
        border-top-left-radius: 40px;
        overflow: hidden;
        padding: 0 32px;
        box-sizing: border-box;
        width: 100%;
        transition: all 0.3s ease;
        max-height: 700px;
        .sort-wrap-top{
            width: 100%;
            height: 46px;
            padding-bottom: 30px;
            box-sizing: border-box;
            .sort-wrap-top-heng{
                width: 40px;
                height: 4px;
                background: #008589;
            }
            .sort-wrap-top-xia{
                margin-top: 10px;
                color: #008589;
                font-weight: bold;
                transform: rotate(90deg);
            }
        }
        .shop-sort-top{
            width: 100%;
            .shop-sort-content{
                width: 100%;
                height: 90px;
                background: #ffffff;
                padding-top: 0;
                box-sizing: border-box;
                border-bottom: 1px solid #E2E3E4;
                .shop-sort-heng{
                    width:8px;
                    height:40px;
                    background:rgba(0,133,137,1);
                    opacity:1;
                    border-radius:4px;
                    margin-right: 10px;
                }
                .shop-sort-titles{
                    color: #393A3B;
                    font-size: 40px;
                    font-weight: bold;
                }
                .shop-sort-title{
                    width: 400px;
                    overflow: hidden;
                    color: #969798;
                    .shop-sort-name{
                        color: #393A3B;
                        font-size: 32px;
                        font-weight: bold;
                        margin-bottom: 12px;
                    }
                    .shop-sort-address{
                        width: 100%;
                        overflow: hidden;
                        font-size: 24px;
                    }
                }
                .shop-sort-skip{
                    width: 90px;
                    float: right;
                    text-align: center;
                    font-size: 24px;
                    color: #008589;
                    .sort-skip-tb{
                        width: 64px;
                        height: 64px;
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        margin: 0 auto;
                        margin-bottom: 12px;
                    }
                }
            }
            .shop-sort-content1{
                width: 100%;
                background: #ffffff;
                box-sizing: border-box;
                display: flex;
                align-items: center;
                padding: 0 32px;
                padding-bottom: 20px;
                .sort-content1-btn{
                    width: 100px;
                    height: 48px;
                    border-radius: 28px;
                    border: 2px solid #CE090A;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    color: #CE090A;
                    font-size: 18px;
                    margin-right: 40px;
                }
                .sort-content1-title{
                    color: #707070;
                    font-size: 24px;
                }
            }
        }
        .markers-list-wrap{
            overflow: scroll;
            width: 100%;
            height: 600px;
            .markers-list{
                width: 100%;
                height: 158px;
                .shop-sort-img{
                    width: 136px;
                    height: 102px;
                }
                .shop-sort-title{
                    width: 530px;
                    overflow: hidden;
                    color: #969798;
                    border-bottom: 1px solid #E2E3E4;
                    height: 150px;
                    padding-top: 35px;
                    box-sizing: border-box;
                    .shop-sort-name{
                        color: #393A3B;
                        font-size: 32px;
                        font-weight: bold;
                        margin-bottom: 12px;
                    }
                    .shop-sort-address{
                        width: 100%;
                        overflow: hidden;
                        font-size: 24px;
                    }
                }
            }
        }
    }
}

.course-head{
    width: 100%;
    padding-bottom: 20px;
    position: fixed;
    top: 0;
    z-index: 600;
    background: #ffffff;
    .search-content{
        width:702px;
        height:68px;
        margin: 0 auto;
        background:#f4f4f4;
        border-radius:44px;
        padding: 0 32px;
        box-sizing: border-box;
        color: #ACACAC;
        font-size: 28px;
        margin-top: 135px;
        margin-bottom: 16px;
        .search-icon{
            width: 44px;
            margin-right: 12px;
        }
        .search-btn{
            width:120px;
            height:60px;
            background:#008589;
            color: #ffffff;
            font-size: 28px;
            border-radius:12px;
        }
    }
}
